/*
 * @Author: error: git config user.name && git config user.email & please set dead value or install git
 * @Date: 2022-10-25 17:27:26
 * @LastEditors: error: git config user.name && git config user.email & please set dead value or install git
 * @LastEditTime: 2022-10-25 18:04:31
 * @FilePath: \FlappyBird游戏开发\js\game.js
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
// 得到游戏盒子
const gameBox = document.querySelector("#game_box");
// 得到小鸟盒子
const bird = document.querySelector("#bird");
// 小鸟top值（距顶部距离）
let birdTop = 200;
// 为了让下落越来越快，可以设置一个临时变量，表示每一帧下落多少
let deltaTop = 0;

// 帧编号
let f = 0;
// 小鸟扑腾翅膀的步骤数字，0、1、2
let step = 0;

// 小鸟旋转角度
let birdRotate = 0;

// 大地背景的x值
let landBgX = 0;
// 得到大地
const land = document.querySelector("#land");

// 得到4个管子
const pipe1_up = document.querySelector("#pipe1_up");
const pipe1_down = document.querySelector("#pipe1_down");
const pipe2_up = document.querySelector("#pipe2_up");
const pipe2_down = document.querySelector("#pipe2_down");

// 管子1的left值
let pipe1Left = 480;
// 管子2的left值
let pipe2Left = 880;

// 【新管子】管子1的height值
let pipe1_up_h = 300;
// 【新管子】管子2的height值
let pipe2_up_h = 200;


// 得到遮罩
const cover = document.querySelector('#cover');

// 得到重玩儿按钮
const restart = document.querySelector('#restart');

// 分数
let score = 0;
// 得到分数盒子
const scoreBox = document.querySelector('#score_box');
// 管子1是否加分了
let pipe1Scored = false;
// 管子2是否加分了
let pipe2Scored = false;

// 得到音频
const fly_audio = document.querySelector('#fly_audio');
const bomb_audio = document.querySelector('#bomb_audio');
const score_audio = document.querySelector('#score_audio');

// 定时器。每20毫秒执行函数一次。
let timer = setInterval(() => {
    // 让deltaTop值加0.X，这个数值决定了小鸟下落的速度“变化的快慢”
    deltaTop += 0.5;
    // 小鸟下落
    birdTop += deltaTop;
    // 设置小鸟的top值。别忘了拼接最后的“px”单位哦。
    bird.style.top = birdTop + "px";
    // 验收，让小鸟不能飞出上边界
    if (birdTop < 0) {
        birdTop = 0;
    };

    // 小鸟的AABB盒之a1值
    birdA1 = birdTop + 6;
    // 小鸟的AABB盒之a2值
    birdA2 = birdTop + 28;
    // 小鸟的AABB盒之b1值
    birdB1 = 170 + 6;
    // 小鸟的AABB盒之b1值
    birdB2 = 170 + 45;
    // 在控制台输出小鸟的AABB盒数据
    console.log(birdA1, birdA2, birdB1, birdB2);

    // 让帧编号加1
    f++;
    // 每3帧扑腾一次翅膀
    if (f % 3 == 0) {
        // 让扑腾翅膀的步骤数字加1
        step++;
        // 如果扑腾翅膀的步骤数字大于2了，就重新从0开始
        if (step > 2) {
            step = 0;
        }
        // 精灵么图，小鸟是三张图片合成一张图片的，所以这里可以设置background-position
        bird.style.backgroundPosition = -step * 100 + "%0";
    };

    // 让小鸟旋转角度变化
    birdRotate += 3;
    // 让小鸟旋转
    bird.style.transform = "rotate(" + birdRotate + "deg)";

    // 管子移动
    pipe1Left -= 3;
    pipe2Left -= 3;
    // “倒腾”管子
    if (pipe1Left < -88) {
        // 让管子1跑到管子2的后面400位置
        pipe1Left = pipe2Left + 400;
        // 随机高度，在60~300之间随机
        pipe1_up_h = parseInt(Math.random() * 240) + 60;
        // 设置样式。包括下管子上管子的高度、下管子的top值、下管子的height值
        pipe1_up.style.height = pipe1_up_h + "px";
        pipe1_down.style.top = pipe1_up_h + 200 + "px";
        pipe1_down.style.height = 560 - pipe1_up_h - 200 + "px";
        // 标记管子1没有被加分
        pipe1Scored = false;
    } else if (pipe2Left < -88) {
        // 让管子2跑到管子1的后面400位置
        pipe2Left = pipe1Left + 400;
        // 随机高度，在60~300之间随机
        pipe2_up_h = parseInt(Math.random() * 240) + 60;
        // 设置样式。包括下管子上管子的高度、下管子的top值、下管子的height值
        pipe2_up.style.height = pipe2_up_h + "px";
        pipe2_down.style.top = pipe2_up_h + 200 + "px";
        pipe2_down.style.height = 560 - pipe2_up_h - 200 + "px";
        // 标记管子2没有被加分
        pipe2Scored = false;

    }
    // 让管子DOM元素跟随变量变化
    pipe1_up.style.left = pipe1Left + "px";
    pipe1_down.style.left = pipe1Left + "px";
    pipe2_up.style.left = pipe2Left + "px";
    pipe2_down.style.left = pipe2Left + "px";

    // 大地移动，就是改变背景定位
    landBgX -= 3;
    land.style.backgroundPosition = landBgX + "px 0";

    // 碰撞检测
    if (
        birdB2 > pipe1Left && birdB1 < pipe1Left + 88 && birdA1 < pipe1_up_h
        ||
        birdB2 > pipe1Left && birdB1 < pipe1Left + 88 && birdA2 > pipe1_up_h +
        200
        ||
        birdB2 > pipe2Left && birdB1 < pipe2Left + 88 && birdA1 < pipe2_up_h
        ||
        birdB2 > pipe2Left && birdB1 < pipe2Left + 88 && birdA2 > pipe2_up_h +
        200
        ||
        birdA2 > 560
    ) {
        console.log('撞了');
        // 停止定时器
        clearInterval(timer);
        // 让遮罩层的透明度变为1
        cover.style.opacity = 1;
        // 显示重玩按钮
        restart.style.top = '200px';
        // 碰撞时，有碰撞声音
        bomb_audio.load();
        bomb_audio.play();
    }

    // 加分代码
    // 如果管子1还没有加分，并且小鸟已经越过了管子1
    if (!pipe1Scored && birdB1 > pipe1Left + 88) {
        // 管子1已经加分
        pipe1Scored = true;
        // 加分
        score++;
        // 更改分数显示
        scoreBox.innerText = score;
        // 加分音效
        score_audio.load();
        score_audio.play();

    }
    // 如果管子1还没有加分，并且小鸟已经越过了管子1
    if (!pipe2Scored && birdB1 > pipe2Left + 88) {
        // 管子1已经加分
        pipe2Scored = true;
        // 加分
        score++;
        // 更改分数显示
        scoreBox.innerText = score;
        // 加分音效
        score_audio.load();
        score_audio.play();
    }
}, 20);

// 给游戏盒子设置点击事件
gameBox.onclick = () => {
    // 点击鼠标时，小鸟应该有一个负向的变化量，这个数字绝对值越大，小鸟蹦的越高
    deltaTop = -10;
    // 小鸟鸟头向上
    birdRotate = -80;
    // 加载飞翔声音
    fly_audio.load();
    // 播放飞翔声音
    fly_audio.play();
};

// 点击重玩儿按钮，刷新网页
restart.onclick = () => {
    location.reload();
};